// components/video-swiper/index.js
import { videoStore } from '../../store/index'
// 使用全局数据
const app = getApp()

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    pageData: {
      type: Array,
      value: []
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    swiperHeight: 0,
    swiperData: [],
    swiperIndex: 0,
    otherData: [],
  },
  lifetimes: {
    attached: function() {
      // 监听
      videoStore.onState("videoSwiperImageHeight", videoSwiperImageHeight => {
        this.setData({ swiperHeight: videoSwiperImageHeight })
      }) 
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    // 监听swiper的图片高度
    swiperImageLoad(e) {
      if(videoStore.state.videoSwiperImageHeight !== 0) return
      const width = e.detail.width
      const height = e.detail.height
      const resultHeight = (height / width) * app.globalData.screenWidth
      videoStore.setState("videoSwiperImageHeight", resultHeight)
    },
    // 监听轮播图滚动
    swiperMove(e) {
      const index = e.detail.current
      this.setData({swiperIndex: index})
    },
    // 监听子组件的图片加载
    imgItemLoad() {
      this.triggerEvent("imgItemLoad")
    },
    // 点击轮播图图片事件
    handleClickSwiperImg(e) {
      const id = e.target.dataset.id
      wx.navigateTo({
        url: '/pages/video-player/index?id=' + id,
      })
    }
  },
  // 监听数据传入
  observers: {
    'pageData': function(val) {
      if(val.length === 0) return 
      this.setData({
        swiperData: this.properties.pageData.slice(0, 3),
        otherData: this.properties.pageData.slice(3)
      })
    }
  }
})
